/**
 * 权限拦截：导航守卫 + Token
 */
import router, { asyncRoutes } from '@/router'
import store from './store'

// 导入进度条插件
import nprogress from 'nprogress'
import 'nprogress/nprogress.css'

// 设置页面的标题
import getPageTitle from '@/utils/get-page-title'

// 创建白名单,用户不需要有 token ,可以直接访问的页面
const whiteList = ['/login', '/404']

// 创建前置守卫
router.beforeEach(async(to, from, next) => {
// 获取token
  const token = store.state.user.token

  // 开启进度条
  nprogress.start()

  // 判断token是否存在
  if (token) {
    if (to.path === '/login') {
      next('/')
    } else {
      // 调用获取用户信息的action方法
      // 在这里写的原因有两个
      // 要求用户登录以后再获取用户信息,并且要求是跳转到其他页面之前
      // await store.dispatch('user/getUserInfo')
      // 用户的权限信息，在上面这一行调用的，如果想获取用户权限信息，需要在这里进行开发
      // 用户登录以后，先判断是否有用户信息，
      // 用户登录或者刷新以后，都没有用户信息，需要进行调用 API 获取用户信息(权限信息)
      // 在获取到用户的权限信息以后，需要存储到 Vuex 中

      if (!store.getters.userId) {
        // 这个权限信息可以从vuex中取,也可以从actions中返回
        const menus = await store.dispatch('user/getUserInfo')

        // 需要从 vuex 中取出来权限信息 和 预置的动态路由进行匹配，筛选出当前用户有权访问的路由
        // 使用 addRoutes 方法将筛选出来的有权访问的路由 添加到 router 对象中才可以
        const filterRoutes = asyncRoutes.filter(route => {
          // 取出路由模块的 name 名称
          const name = route.children[0].name

          // 如果 menus 后端返回的权限模块中包含某一个 模块的 name 名称
          // 说明用户拥有该页面的权限，就会将对应的路由对应返回
          return menus.includes(name)
        })

        filterRoutes.push({ path: '*', redirect: '/404', hidden: true })

        // 使用 addRoutes 添加的动态路由，只存在内存中
        // router.addRoutes(asyncRoutes)
        // 这句话比不可少，因为这句话是将动态路由添加到路由对象中，只有添加到路由对象中
        // 对应的路由才能够访问
        router.addRoutes(filterRoutes)
        store.commit('permission/setRoutes', filterRoutes)

        // 在将 404 放到路由规则最后，刷新页面，发现页面空白
        // 这个是 Vue-router 已知的 bug

        const allRoutes = store.state.permission.routes.map(item => item.path)
        // 大家可以这样理解：
        // 之前并没有这些路由，通过 addRoutes 添加后才有了路由，
        // 然后必须告诉 vue-router 你要帮我跳转的那个地址去，
        // next({
        //   path: to.path,
        //   replace: true // 将之前的的路由对象销毁，开启一个路由规则
        // })
        if (to.path === '/employees/detail') {
          next({
            path: to.fullPath
          })
        } else {
          next({
            path: allRoutes.includes(to.path) ? to.path : '/',
            replace: true // 将之前的的路由对象销毁，开启一个路由规则
          })
        }
      }
      next()
    }
  } else {
    // 查看访问的路径是否存在白名单中
    if (whiteList.includes(to.path)) {
      next()
    } else {
      next('/login')
    }
  }
  // 隐藏进度条
  nprogress.done()
})

router.beforeEach((to, from, next) => {
// 设置页面的标题
  document.title = getPageTitle(to.meta.title)
  next()
})

router.afterEach((to, from) => {
  //
  // 隐藏进度条
  nprogress.done()
})

/*
import { Message } from 'element-ui'
// NProgress 进度条组件
import NProgress from 'nprogress' // progress bar
// 进度条样式文件
import 'nprogress/nprogress.css' // progress bar style
// 导入封装好的工具模块
import { getToken } from '@/utils/auth' // get token from cookie
// 设置页面的标题
import getPageTitle from '@/utils/get-page-title'

NProgress.configure({ showSpinner: false }) // NProgress Configuration

// 白名单: 不需要进行任何设置就能进行访问的东西
const whiteList = ['/login'] // no redirect whitelist

// 导航守卫
// to: 去哪
// from: 从哪来
// next: 放行
router.beforeEach(async(to, from, next) => {
  // start progress bar
  NProgress.start()

  // set page title
  document.title = getPageTitle(to.meta.title)

  // determine whether the user has logged in
  const hasToken = getToken()

  // 判断是否存在 token
  if (hasToken) {
    // 如果用户登录了,访问的又是登录页面
    if (to.path === '/login') {
      // 直接放行进入主页
      next({ path: '/' })
      NProgress.done()
    } else {
      // 获取用户的信息
      const hasGetUserInfo = store.getters.name
      if (hasGetUserInfo) {
        next()
      } else {
        try {
          // get user info
          // dispatch --> action
          // commit --> mutation
          await store.dispatch('user/getInfo')

          next()
        } catch (error) {
          // 尝试获取用户信息失败
          // 移除 token
          // 回到登录页面
          await store.dispatch('user/resetToken')
          Message.error(error || 'Has Error')
          next(`/login?redirect=${to.path}`)
          NProgress.done()
        }
      }
    }
  } else {
    // 如果没有 Token 进入 else

    // 判断访问的路径是否在白名单中,如果存在,直接放行
    if (whiteList.indexOf(to.path) !== -1) {
      // in the free login whitelist, go directly
      next()
    } else {
      // other pages that do not have permission to access are redirected to the login page.
      // 如果访问的不在白名单,让它跳转到登录去
      next(`/login?redirect=${to.path}`)
      NProgress.done()
    }
  }
})

// 后置守卫
router.afterEach(() => {
  // finish progress bar
  NProgress.done()
})
*/5
